<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>管理台</title>
    <link rel="stylesheet" href="../layui/css/layui.css">
</head>
<body>
<div class="layui-layout layui-layout-admin">
    <#include "./header.html">

    <#include "./sidebar.html">

    <div class="layui-body">
        <!-- 内容主体区域 -->
        <div style="padding: 15px;">
            <div class="layui-tab-item layui-show">
                <div class="layui-main">
                    <div class="layui-form layui-border-box layui-table-view" lay-filter="LAY-table-1" lay-id="test" style=" ">
                        <div class="layui-table-tool">
                            <div class="layui-table-tool-temp">
                                <button class="layui-btn layui-btn-sm" lay-event="getCheckData">获取选中行数据</button>
                                <button class="layui-btn layui-btn-sm" lay-event="getCheckLength">获取选中数目</button>
                                <button class="layui-btn layui-btn-sm" lay-event="isAll">验证是否全选</button>
                            </div>
                        </div>
                        <div class="layui-table-tool-self">
                            <div class="layui-inline" title="筛选列" lay-event="LAYTABLE_COLS">
                                <i class="layui-icon layui-icon-cols"></i>
                            </div>
                            <div class="layui-inline" title="导出" lay-event="LAYTABLE_EXPORT">
                                <i class="layui-icon layui-icon-export"></i>
                            </div>
                            <div class="layui-inline" title="打印" lay-event="LAYTABLE_PRINT">
                                <i class="layui-icon layui-icon-print"></i>
                            </div>
                            <div class="layui-inline" title="提示" lay-event="LAYTABLE_TIPS">
                                <i class="layui-icon layui-icon-tips"></i>
                            </div>
                        </div>
                    </div>
                    <div class="layui-table-box">
                        <div class="layui-table-header">
                            <table cellspacing="0" cellpadding="0" border="0" class="layui-table">
                                <thead>
                                <tr>
                                    <th data-field="0" data-key="1-0-0" data-unresize="true" class=" layui-table-col-special">
                                        <div class="layui-table-cell laytable-cell-1-0-0 laytable-cell-checkbox">
                                            <input type="checkbox" name="layTableCheckbox" lay-skin="primary" lay-filter="layTableAllChoose">
                                            <div class="layui-unselect layui-form-checkbox" lay-skin="primary">
                                                <i class="layui-icon layui-icon-ok"></i>
                                            </div>
                                        </div>
                                    </th>
                                    <th data-field="id" data-key="1-0-1" data-unresize="true" class=" layui-unselect">
                                        <div class="layui-table-cell laytable-cell-1-0-1">
                                            <span>ID</span>
                                            <span class="layui-table-sort layui-inline">
                                                <i class="layui-edge layui-table-sort-asc" title="升序"></i>
                                                <i class="layui-edge layui-table-sort-desc" title="降序"></i>
                                            </span>
                                        </div>
                                    </th>
                                    <th data-field="username" data-key="1-0-2" class="">
                                        <div class="layui-table-cell laytable-cell-1-0-2">
                                            <span>用户名</span></div>
                                    </th>
                                    <th data-field="email" data-key="1-0-3" class="">
                                        <div class="layui-table-cell laytable-cell-1-0-3">
                                            <span>邮箱</span>
                                        </div>
                                    </th>
                                    <th data-field="sex" data-key="1-0-4" class=" layui-unselect">
                                        <div class="layui-table-cell laytable-cell-1-0-4">
                                            <span>性别</span>
                                            <span class="layui-table-sort layui-inline">
                                                <i class="layui-edge layui-table-sort-asc" title="升序"></i>
                                                <i class="layui-edge layui-table-sort-desc" title="降序"></i>
                                            </span>
                                        </div>
                                    </th>
                                    <th data-field="city" data-key="1-0-5" class="">
                                        <div class="layui-table-cell laytable-cell-1-0-5">
                                            <span>城市</span>
                                        </div>
                                    </th>
                                    <th data-field="sign" data-key="1-0-6" class="">
                                        <div class="layui-table-cell laytable-cell-1-0-6">
                                            <span>签名</span>
                                        </div>
                                    </th>
                                    <th data-field="experience" data-key="1-0-7" class=" layui-unselect">
                                        <div class="layui-table-cell laytable-cell-1-0-7">
                                            <span>积分</span>
                                            <span class="layui-table-sort layui-inline">
                                                <i class="layui-edge layui-table-sort-asc" title="升序"></i>
                                                <i class="layui-edge layui-table-sort-desc" title="降序"></i>
                                            </span>
                                        </div>
                                    </th>
                                    <th data-field="ip" data-key="1-0-8" class="">
                                        <div class="layui-table-cell laytable-cell-1-0-8">
                                            <span>IP</span>
                                        </div>
                                    </th>
                                    <th data-field="logins" data-key="1-0-9" class=" layui-unselect">
                                        <div class="layui-table-cell laytable-cell-1-0-9">
                                            <span>登入次数</span>
                                            <span class="layui-table-sort layui-inline">
                                                <i class="layui-edge layui-table-sort-asc" title="升序"></i>
                                                <i class="layui-edge layui-table-sort-desc" title="降序"></i>
                                            </span>
                                        </div>
                                    </th>
                                    <th data-field="joinTime" data-key="1-0-10" class="">
                                        <div class="layui-table-cell laytable-cell-1-0-10"><span>加入时间</span></div>
                                    </th>
                                    <th data-field="11" data-key="1-0-11" class=" layui-table-col-special">
                                        <div class="layui-table-cell laytable-cell-1-0-11"><span>操作</span></div>
                                    </th>
                                </tr>
                                </thead>
                            </table>
                        </div>
                        <div class="layui-table-body layui-table-main">
                            <table cellspacing="0" cellpadding="0" border="0" class="layui-table">
                                <tbody>
                                <tr data-index="0" class="">
                                    <td data-field="0" data-key="1-0-0" class="layui-table-col-special">
                                        <div class="layui-table-cell laytable-cell-1-0-0 laytable-cell-checkbox">
                                            <input type="checkbox" name="layTableCheckbox" lay-skin="primary">
                                            <div class="layui-unselect layui-form-checkbox" lay-skin="primary">
                                                <i class="layui-icon layui-icon-ok"></i>
                                            </div>
                                        </div>
                                    </td>
                                    <td data-field="id" data-key="1-0-1" class="">
                                        <div class="layui-table-cell laytable-cell-1-0-1">10001</div>
                                    </td>
                                    <td data-field="username" data-key="1-0-2" data-edit="text" class="">
                                        <div class="layui-table-cell laytable-cell-1-0-2">杜甫</div>
                                    </td>
                                    <td data-field="email" data-key="1-0-3" data-edit="text" data-content="test@email.com" class="">
                                        <div class="layui-table-cell laytable-cell-1-0-3"><em>test@email.com</em></div>
                                    </td>
                                    <td data-field="sex" data-key="1-0-4" data-edit="text" class="">
                                        <div class="layui-table-cell laytable-cell-1-0-4">男</div>
                                    </td>
                                    <td data-field="city" data-key="1-0-5" class="">
                                        <div class="layui-table-cell laytable-cell-1-0-5">浙江杭州</div>
                                    </td>
                                    <td data-field="sign" data-key="1-0-6" class="">
                                        <div class="layui-table-cell laytable-cell-1-0-6">点击此处，显示更多。当内容超出时，点击单元格会自动显示更多内容。</div>
                                    </td>
                                    <td data-field="experience" data-key="1-0-7" class="">
                                        <div class="layui-table-cell laytable-cell-1-0-7">116</div>
                                    </td>
                                    <td data-field="ip" data-key="1-0-8" class="">
                                        <div class="layui-table-cell laytable-cell-1-0-8">192.168.0.8</div>
                                    </td>
                                    <td data-field="logins" data-key="1-0-9" class="">
                                        <div class="layui-table-cell laytable-cell-1-0-9">108</div>
                                    </td>
                                    <td data-field="joinTime" data-key="1-0-10" class="">
                                        <div class="layui-table-cell laytable-cell-1-0-10">2016-10-14</div>
                                    </td>
                                    <td data-field="11" data-key="1-0-11" data-off="true" class="layui-table-col-special">
                                        <div class="layui-table-cell laytable-cell-1-0-11">
                                            <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
                                            <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
                                        </div>
                                    </td>
                                </tr>
                                </tbody>
                            </table>
                        </div>
                        <div class="layui-table-fixed layui-table-fixed-l"><div class="layui-table-header">
                            <table cellspacing="0" cellpadding="0" border="0" class="layui-table">
                                <thead>
                                <tr>
                                    <th data-field="0" data-key="1-0-0" data-unresize="true" class=" layui-table-col-special">
                                        <div class="layui-table-cell laytable-cell-1-0-0 laytable-cell-checkbox">
                                            <input type="checkbox" name="layTableCheckbox" lay-skin="primary" lay-filter="layTableAllChoose">
                                            <div class="layui-unselect layui-form-checkbox" lay-skin="primary">
                                                <i class="layui-icon layui-icon-ok"></i>
                                            </div>
                                        </div>
                                    </th>
                                    <th data-field="id" data-key="1-0-1" data-unresize="true" class=" layui-unselect">
                                        <div class="layui-table-cell laytable-cell-1-0-1">
                                            <span>ID</span>
                                            <span class="layui-table-sort layui-inline">
                                                <i class="layui-edge layui-table-sort-asc" title="升序"></i><i class="layui-edge layui-table-sort-desc" title="降序"></i></span></div></th></tr></thead></table></div>
                            <div class="layui-table-body" style="height: 312px;"><table cellspacing="0" cellpadding="0" border="0" class="layui-table"><tbody><tr data-index="0" class=""><td data-field="0" data-key="1-0-0" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-0 laytable-cell-checkbox"><input type="checkbox" name="layTableCheckbox" lay-skin="primary"><div class="layui-unselect layui-form-checkbox" lay-skin="primary"><i class="layui-icon layui-icon-ok"></i></div></div></td><td data-field="id" data-key="1-0-1" class=""><div class="layui-table-cell laytable-cell-1-0-1">10001</div></td></tr><tr data-index="1" class=""><td data-field="0" data-key="1-0-0" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-0 laytable-cell-checkbox"><input type="checkbox" name="layTableCheckbox" lay-skin="primary" checked=""><div class="layui-unselect layui-form-checkbox layui-form-checked" lay-skin="primary"><i class="layui-icon layui-icon-ok"></i></div></div></td><td data-field="id" data-key="1-0-1" class=""><div class="layui-table-cell laytable-cell-1-0-1">10002</div></td></tr><tr data-index="2" class=""><td data-field="0" data-key="1-0-0" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-0 laytable-cell-checkbox"><input type="checkbox" name="layTableCheckbox" lay-skin="primary"><div class="layui-unselect layui-form-checkbox" lay-skin="primary"><i class="layui-icon layui-icon-ok"></i></div></div></td><td data-field="id" data-key="1-0-1" class=""><div class="layui-table-cell laytable-cell-1-0-1">10003</div></td></tr><tr data-index="3" class=""><td data-field="0" data-key="1-0-0" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-0 laytable-cell-checkbox"><input type="checkbox" name="layTableCheckbox" lay-skin="primary"><div class="layui-unselect layui-form-checkbox" lay-skin="primary"><i class="layui-icon layui-icon-ok"></i></div></div></td><td data-field="id" data-key="1-0-1" class=""><div class="layui-table-cell laytable-cell-1-0-1">10004</div></td></tr><tr data-index="4" class=""><td data-field="0" data-key="1-0-0" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-0 laytable-cell-checkbox"><input type="checkbox" name="layTableCheckbox" lay-skin="primary"><div class="layui-unselect layui-form-checkbox" lay-skin="primary"><i class="layui-icon layui-icon-ok"></i></div></div></td><td data-field="id" data-key="1-0-1" class=""><div class="layui-table-cell laytable-cell-1-0-1">10005</div></td></tr><tr data-index="5" class=""><td data-field="0" data-key="1-0-0" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-0 laytable-cell-checkbox"><input type="checkbox" name="layTableCheckbox" lay-skin="primary"><div class="layui-unselect layui-form-checkbox" lay-skin="primary"><i class="layui-icon layui-icon-ok"></i></div></div></td><td data-field="id" data-key="1-0-1" class=""><div class="layui-table-cell laytable-cell-1-0-1">10006</div></td></tr><tr data-index="6" class=""><td data-field="0" data-key="1-0-0" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-0 laytable-cell-checkbox"><input type="checkbox" name="layTableCheckbox" lay-skin="primary"><div class="layui-unselect layui-form-checkbox" lay-skin="primary"><i class="layui-icon layui-icon-ok"></i></div></div></td><td data-field="id" data-key="1-0-1" class=""><div class="layui-table-cell laytable-cell-1-0-1">10007</div></td></tr><tr data-index="7" class=""><td data-field="0" data-key="1-0-0" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-0 laytable-cell-checkbox"><input type="checkbox" name="layTableCheckbox" lay-skin="primary"><div class="layui-unselect layui-form-checkbox" lay-skin="primary"><i class="layui-icon layui-icon-ok"></i></div></div></td><td data-field="id" data-key="1-0-1" class=""><div class="layui-table-cell laytable-cell-1-0-1">10008</div></td></tr></tbody></table></div></div><div class="layui-table-fixed layui-table-fixed-r" style="right: -1px;"><div class="layui-table-header"><table cellspacing="0" cellpadding="0" border="0" class="layui-table"><thead><tr><th data-field="11" data-key="1-0-11" class=" layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-11"><span>操作</span></div></th></tr></thead></table><div class="layui-table-mend"></div></div><div class="layui-table-body" style="height: 312px;"><table cellspacing="0" cellpadding="0" border="0" class="layui-table"><tbody><tr data-index="0" class=""><td data-field="11" data-key="1-0-11" data-off="true" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-11"> <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> </div></td></tr><tr data-index="1" class=""><td data-field="11" data-key="1-0-11" data-off="true" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-11"> <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> </div></td></tr><tr data-index="2" class=""><td data-field="11" data-key="1-0-11" data-off="true" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-11"> <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> </div></td></tr><tr data-index="3" class=""><td data-field="11" data-key="1-0-11" data-off="true" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-11"> <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> </div></td></tr><tr data-index="4" class=""><td data-field="11" data-key="1-0-11" data-off="true" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-11"> <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> </div></td></tr><tr data-index="5" class=""><td data-field="11" data-key="1-0-11" data-off="true" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-11"> <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> </div></td></tr><tr data-index="6" class=""><td data-field="11" data-key="1-0-11" data-off="true" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-11"> <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> </div></td></tr><tr data-index="7" class=""><td data-field="11" data-key="1-0-11" data-off="true" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-11"> <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> </div></td></tr></tbody></table></div></div></div>
                    <div class="layui-table-page">
                        <div id="layui-table-page1">
                            <div class="layui-box layui-laypage layui-laypage-default" id="layui-laypage-1">
                                <a href="javascript:;" class="layui-laypage-prev layui-disabled" data-page="0">
                                    <i class="layui-icon"></i>
                                </a>
                                <span class="layui-laypage-curr">
                                    <em class="layui-laypage-em"></em>
                                    <em>1</em>
                                </span>
                                <a href="javascript:;" data-page="2">2</a>
                                <a href="javascript:;" data-page="3">3</a>
                                <span class="layui-laypage-spr">…</span>
                                <a href="javascript:;" class="layui-laypage-last" title="尾页" data-page="300000">300000</a>
                                <a href="javascript:;" class="layui-laypage-next" data-page="2">
                                    <i class="layui-icon"></i>
                                </a>
                                <span class="layui-laypage-skip">到第<input type="text" min="1" value="1" class="layui-input">页
                                    <button type="button" class="layui-laypage-btn">确定</button>
                                </span>
                                <span class="layui-laypage-count">共 3000000 条</span>
                                <span class="layui-laypage-limits">
                                    <select lay-ignore="">
                                        <option value="10" selected="">10 条/页</option>
                                        <option value="20">20 条/页</option>
                                        <option value="30">30 条/页</option>
                                        <option value="40">40 条/页</option>
                                        <option value="50">50 条/页</option>
                                    </select>
                                </span>
                            </div>
                        </div>
                    </div>
                </div>
                </div>
            </div>
        </div>
    </div>

    <div class="layui-footer">
        <!-- 底部固定区域 -->
    </div>
</div>
<script src="../layui/layui.js"></script>
<script>
    //JS
    layui.use(['element', 'layer', 'util'], function(){
        var element = layui.element
            ,layer = layui.layer
            ,util = layui.util
            ,$ = layui.$;

        //头部事件
        util.event('lay-header-event', {
            //左侧菜单事件
            menuLeft: function(othis){
                layer.msg('展开左侧菜单的操作', {icon: 0});
            }
            ,menuRight: function(){
                layer.open({
                    type: 1
                    ,content: '<div style="padding: 15px;">处理右侧面板的操作</div>'
                    ,area: ['260px', '100%']
                    ,offset: 'rt' //右上角
                    ,anim: 5
                    ,shadeClose: true
                });
            }
        });

    });
</script>
</body>
</html>
